<!DOCTYPE html>
<html lang="en">
<head>
  <head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>登录</title>
  <link href="/assets/plugins/toaster/toastr.min.css" rel="stylesheet" />
  <link href="/assets/plugins/nprogress/nprogress.css" rel="stylesheet" />
  <link href="/assets/plugins/flag-icons/css/flag-icon.min.css" rel="stylesheet"/>
  <link href="/assets/plugins/jvectormap/jquery-jvectormap-2.0.3.css" rel="stylesheet" />
  <link href="/assets/plugins/ladda/ladda.min.css" rel="stylesheet" />
  <link href="/assets/plugins/select2/css/select2.min.css" rel="stylesheet" />
  <link href="/assets/plugins/daterangepicker/daterangepicker.css" rel="stylesheet" />
  <link id="sleek-css" rel="stylesheet" href="/assets/css/sleek.css" />
  <link href="/assets/img/favicon.png" rel="shortcut icon" />
  <script src="/assets/plugins/nprogress/nprogress.js"></script>
</head>
</head>
  <body class="bg-light-gray" id="body">
      <div class="container d-flex flex-column justify-content-between vh-100">
      <div class="row justify-content-center mt-5">
        <div class="col-xl-5 col-lg-6 col-md-10">
          <div class="card">
            <div class="card-header bg-primary">
              <div class="app-brand">
                <a href="#">
                  <svg class="brand-icon" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" width="30" height="33"
                    viewBox="0 0 30 33">
                    <g fill="none" fill-rule="evenodd">
                      <path class="logo-fill-blue" fill="#7DBCFF" d="M0 4v25l8 4V0zM22 4v25l8 4V0z" />
                      <path class="logo-fill-white" fill="#FFF" d="M11 4v25l8 4V0z" />
                    </g>
                  </svg>
                  <span class="brand-name">后台管理系统</span>
                </a>
              </div>
            </div>
            <div class="card-body p-5">

              <h4 class="text-dark mb-5">登录</h4>
                <div class="row">
                  <div class="form-group col-md-12 mb-4">
                    <input type="email" class="form-control input-lg" id="email" aria-describedby="emailHelp" placeholder="登录名">
                  </div>
                  <div class="form-group col-md-12 ">
                    <input type="password" class="form-control input-lg" id="password" placeholder="登录密码">
                  </div>
                  <div class="form-group col-md-7">
                    <input type="text" class="form-control input-lg" id="code" placeholder="验证码">
                  </div>
                  <div class="form-group col-md-5">
                      <img style="cursor: pointer;" id="img-code" alt="图片验证码">
                  </div>
                  <div class="col-md-12" style="margin-top:20px; ">
                    <button id="btn-login" class="btn btn-lg btn-primary btn-block mb-4">登录</button>
                  </div>
                </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script src="/assets/plugins/jquery/jquery.min.js"></script>
    <script src="/assets/js/store.js"></script>
    <script type="text/javascript">
        Store.initPage = function () {
          var id = "";
          $("#img-code").on("click", function () {
              var that = this;
              Http.post("/admin/code", {
              }, function (ret) {
                  id = ret.id;
                  $(that).attr("src", ret.b64);
              });
          });

          $("#img-code").click();

          Element.Enter("#code", function(){
            $("#btn-login").click();
          });

          $("#btn-login").on("click", function () {
            var params = {
              id      :id,
              code    :$("#code").val(),
              userName:$("#email").val(),
              password:$("#password").val(),
            };
            Http.post(Config.http.path.login, params, function(ret) {
              cache.set('admin', ret);

              Utils.toast.success("登录成功");
              setTimeout(function () {
                window.location.href = Config.homeUrl;
              }, 1500);
            }, function () {
                $("#img-code").click();
            });
          });
        };
    </script>
</body>
</html>